// out:../css/

// 导航
.bg-body-tertiary{
    background-color: transparent !important;
    .navbar-collapse{
        flex-grow: 0;
    }
}

// 轮播图：小于768图片高度250 max，大于等于768图片高度400，大于等于992图片高度500
.carousel{
    // 响应式 -> 媒体查询
    @media(max-width: 768px) {
        .carousel-inner{
            height: 250px;
        }
    }
    @media(min-width: 768px) {
        .carousel-inner{
            height: 400px;
        }
    }
    @media(min-width: 992px) {
        .carousel-inner{
            height: 500px;
        }
    }

}



.carousel-item{
    height: 500px;
    background-size: cover;
    background-position: center 0;
}
.carousel-item:nth-child(1){
    background-image: url(../../images/banner_1.jpg);
}

.carousel-item:nth-child(2){
    background-image: url(../../images/banner_2.jpg);
}
.carousel-item:nth-child(3){
    background-image: url(../../images/banner_3.jpg);
}
.carousel-item:nth-child(4){
    background-image: url(../../images/banner_4.jpg);
}

// 开源项目
// 视口宽度大于992：一行排4个盒子 col-lg-3
// 视口宽度大于768：一行排2个盒子 col-md-6
// 视口宽度小于768：一行排1个盒子 col-sm-12

.project{
    margin-top: 60px;
    text-align: center;
    .row{
        div{
            height: 200px;
            a{
                display: block;
                height: 200px;
                border-radius: 4px;
            }
            &:nth-child(1) a{
                background-color: #70c3ff;
            }
            &:nth-child(2) a{
                background-color: #fd6a7f;
            }
            &:nth-child(3) a{
                background-color: #7f8ea0;
            }
            &:nth-child(4) a{
                background-color: #89d04f;
            }

        }
    }
}
